package cn.mujiankeji.mbrowser.界面.小窗页

import androidx.compose.foundation.background
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.WindowInsets
import androidx.compose.foundation.layout.fillMaxHeight
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.ime
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.layout.width
import androidx.compose.foundation.layout.windowInsetsBottomHeight
import androidx.compose.foundation.lazy.LazyRow
import androidx.compose.foundation.lazy.items
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.foundation.text.BasicTextField
import androidx.compose.foundation.text.KeyboardActions
import androidx.compose.foundation.text.KeyboardOptions
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.DisposableEffect
import androidx.compose.runtime.LaunchedEffect
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.rememberCoroutineScope
import androidx.compose.runtime.setValue
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.focus.FocusRequester
import androidx.compose.ui.focus.focusRequester
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.text.TextRange
import androidx.compose.ui.text.input.ImeAction
import androidx.compose.ui.text.input.TextFieldValue
import androidx.compose.ui.unit.dp
import cn.mujiankeji.mbrowser.工具.clickable2
import cn.mujiankeji.mbrowser.界面.框架.小窗视图.小窗状态
import kotlinx.coroutines.CoroutineScope
import kotlinx.coroutines.delay
import kotlinx.coroutines.launch
import 数据.枚举类.toStr
import 数据.枚举类.错误类型
import 界面.组件.按钮.取消图标按钮
import 界面.组件.按钮.确认图标按钮
import 操作.工具类.hexToColorForNull
import 操作.工具类.颜色操作

class 文本编辑窗口状态(
    val 默认值 : String = "",
    val 提示值 : @Composable ()->String = { "输入" },
    val 检测 : suspend (String)-> 错误类型? = {null},
    val 行数 : Int  = 1,
    val 附加按钮 : @Composable ()->Unit = {},
    val 响应 : (String?) -> Unit
    ) : 小窗状态()
{

    var mValue by mutableStateOf(TextFieldValue(默认值, TextRange(默认值.length)))
    var 提交错误类型 by mutableStateOf<错误类型?>(null)
    var coroutine : CoroutineScope?= null

    fun 提交() {
        coroutine?.launch {
            val checkResult = 检测(mValue.text)
            if (checkResult == null){
                响应(mValue.text)
                销毁小窗()
            }
            else {
                提交错误类型 = checkResult
            }
        }

    }
    fun 取消() {
        响应(null)
        销毁小窗()
    }

}

@Composable
fun 文本编辑窗口实现(state : 文本编辑窗口状态){
    state.coroutine = rememberCoroutineScope()
    DisposableEffect(Unit){
        onDispose {
            state.coroutine = null
        }
    }

    Column(modifier = Modifier.fillMaxSize()
        .background(Color.Black.copy(0.3f)))
    {

        Spacer(
            Modifier.fillMaxWidth()
                .weight(1f)
                .clickable2{state.取消()})

        // 圆角设计 -- 基本的内容小窗口
        androidx.compose.material3.Surface(
            shape = RoundedCornerShape(topEnd = 12.dp, topStart = 12.dp),
            shadowElevation = 3.dp,
            modifier = Modifier
                .padding(top = 3.dp),
        ) {
            Column(
                Modifier
                    .background(MaterialTheme.colorScheme.surface)
                    .fillMaxWidth()
            )
            {
                编辑框视图(state)

                Row(Modifier.fillMaxWidth()
                    .height(50.dp)
                    .padding(horizontal = 10.dp)){

                    Box(Modifier.weight(1f)
                        .fillMaxHeight()){
                        state.附加按钮()
                    }

                    Spacer(Modifier.width(12.dp))

                    Row{
                        取消图标按钮 { state.取消() }
                        Spacer(Modifier.width(15.dp))
                        确认图标按钮 { state.提交() }
                    }
                }

            }

        }

        Spacer(Modifier.windowInsetsBottomHeight(WindowInsets.ime))
    }


}

@Composable
private fun 编辑框视图(state : 文本编辑窗口状态){
    val requery = remember { FocusRequester() }

    BasicTextField(
        value = state.mValue, 
        onValueChange = {state.mValue = it},
        textStyle = MaterialTheme.typography.bodyMedium,
        maxLines = state.行数,
        keyboardOptions =if (state.行数 == 1)  KeyboardOptions(imeAction = ImeAction.Send) else KeyboardOptions.Default,
        keyboardActions = KeyboardActions(onSend = {
            if (state.行数 == 1){
                state.提交()
            }
        }),
        modifier = Modifier
            .padding(15.dp,30.dp)
            .focusRequester(requery)
    ){
        Column{
            Box(){
                it()
                if (state.mValue.text.isEmpty()){
                    val hintText = state.提示值()
                    Text(text = hintText,
                        style = MaterialTheme.typography.bodyMedium,
                        color = MaterialTheme.colorScheme.outline)
                }
            }
            if (state.mValue.text.isNotEmpty() && state.提交错误类型 != null){
                Text(text = state.提交错误类型!!.toStr(),
                    modifier = Modifier.padding(0.dp,5.dp),
                    style = MaterialTheme.typography.bodyMedium,
                    color = MaterialTheme.colorScheme.error)
            }
        }
    }

    LaunchedEffect(Unit){
        delay(50)
        requery.requestFocus()
    }
}

@Composable
fun 颜色组视图(
    colors : List<String> = 颜色操作.鲜明对比色(),
    def : String = "",
    change : (String) -> Unit,
){
    var defualt by remember { mutableStateOf(def) }
    LaunchedEffect(def){
        defualt = def
    }

    LazyRow(Modifier.fillMaxSize()){

        items(colors){colorStr->
            colorStr.hexToColorForNull()?.let { color->
                Box(
                    Modifier.fillMaxHeight().width(45.dp),
                    contentAlignment = Alignment.Center){

                    // 选中 为方块
                    if (colorStr == defualt){
                        Box(
                            Modifier.size(20.dp)
                                .clip(RoundedCornerShape(3.dp))
                                .background(color)
                                .clickable {

                                })
                    }

                    // 未选中 为圆形 且半透明
                    else {
                        Box(
                            Modifier.size(20.dp)
                                .clip(CircleShape)
                                .background(color)
                                .clickable {
                                    change(colorStr)
                                    defualt = colorStr
                                })
                    }
                }


            }
        }
    }

}
